<template>
  <div>
    <div class="InviteFriends_die">
      <div></div>
      <div>
        <div>
          <img
            :src="headerSrc?headerSrc:'http://www.zhaoshengku.net/wx-%E6%A4%AD%E5%9C%86%201.png'"
            alt
            mode="aspectFill"
          />
        </div>
        <div>
          <img :src="'https://api.zhaoshengku.net/api/data/getqrcode?id='+id" alt @click="imgLong" />
          <div></div>
        </div>
      </div>
      <div>
        <div>
          <div>可邀请平台</div>
          <div>
            <button open-type="share">
              <img src="http://www.zhaoshengku.net/wx-wx%28my%29.png" alt />
            </button>
          </div>
        </div>
        <!-- <div>
          <div>{{mnilist.wallet_amount}}</div>
          <div>账号余额(元)</div>
          <div @click="tixianmni">立即提现</div>
        </div>
        <div>
          <div>
            <img src="http://www.zhaoshengku.net/wx-yuanjiaojvxt.png" alt />
          </div>
          <div v-if="isshow">
            <div>
              <div>时间</div>
              <div>被邀请人</div>
              <div>状态</div>
            </div>
            <scroll-view scroll-y="true" class="scroll-view">
              <div v-for="(item,index) in list" :key="index" class="scroll_view_div">
                <div>{{item.relation_add_time}}</div>
                <div>{{item.info_nick}}</div>
                <div>已开通</div>
              </div>
            </scroll-view>
          </div>
          <div class="none_p" v-else>暂时没有邀请记录！</div>
        </div>-->
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isshow: false,
      mnilist: {},
      list: [],
      headerCode: "",
      headerSrc: "",
      id: -1
    };
  },
  methods: {
    tixianmni() {
      if (this.mnilist.wallet_amount < 100) {
        wx.showToast({
          title: "余额小于100，暂不支持提现！",
          icon: "none",
          duration: 1000,
          mask: true
        });
      } else {
        wx.request({
          url: "https://qpi.zhaoshengku.net/index/member/putwithdraw",
          data: {
            amount: this.mnilist.wallet_amount
          },
          method: "post",
          header: {
            Authorization: this.headerCode
          },
          success: res => {}
        });
      }
    },
    onShows() {
      this.headerSrc = this.$store.state.myxinxi.info_avatar;
      this.id = this.$store.state.myxinxi.info_member_id;
      wx.getStorage({
        key: "koken",
        success: res => {
          this.headerCode = "Bearer " + res.data;
          // 获取邀请列表
          wx.request({
            url: "https://api.zhaoshengku.net/index/member/getinvitelist",
            method: "post",
            header: {
              Authorization: this.headerCode
            },
            success: res => {
              if (res.data.code == 200) {
                if (res.data.data.length == 0) {
                  this.isshow = false;
                } else {
                  this.isshow = true;
                  console.log(res);
                  res.data.data.forEach(element => {
                    element.relation_add_time = element.relation_add_time.substring(
                      0,
                      10
                    );
                  });
                  this.list = res.data.data;
                }
              }
            },
            fail: res => {
              console.log(res);
              if (res.errMsg) {
                wx.showToast({
                  title: "请检查网络连接！",
                  icon: "none",
                  duration: 1500
                });
              }
            }
          });
          // 获取钱包
          wx.request({
            url: "https://api.zhaoshengku.net/index/member/getwallet",
            method: "post",
            header: {
              Authorization: this.headerCode,
              "X-Requested-With": "xmlhttprequest"
            },
            success: res => {
              if (res.data.code == 200) {
                wx.stopPullDownRefresh();
                this.mnilist = res.data.data;
              }
            },
            fail: res => {
              console.log(res);
              if (res.errMsg) {
                wx.showToast({
                  title: "请检查网络连接！",
                  icon: "none",
                  duration: 1500
                });
              }
            }
          });
        },
        fail: res => {
          wx.showToast({
            title: "未登录！",
            icon: "none",
            duration: 2500
          });
          setTimeout(function() {
            wx.navigateTo({
              url: "/pages/loginRegister/main"
            });
          }, 1000);
        }
      });
    },
    imgLong() {
      var _this = this;

      var url = "https://api.zhaoshengku.net/api/data/getqrcode?id=" + _this.id;
      // var urls = "https://api.zhaoshengku.net/api/data/getqrcode?id="+_this.id;
      wx.previewImage({
        current: url, // 当前显示图片的http链接
        urls: [url] // 需要预览的图片http链接列表
      });
    }
  },
  mounted() {
    wx.setNavigationBarTitle({
      title: "邀请好友"
    });
  },
  onLoad() {
    this.onShows();
  },
  onShareAppMessage: function(res) {
    let users = wx.getStorageSync("user");
    if (res.from === "button") {
      return {
        title: "招生库",
        path:
          "/pages/loginRegister/main?id=" +
          this.$store.state.myxinxi.info_member_id,
        imageUrl: "https://www.zhaoshengku.net/fenxiangbeijingdetu.jpg",
        success: function(res) {
          wx.showToast({
            title: "转发成功",
            icon: "true",
            duration: 1000,
            mask: true
          });
        },
        fail: function(res) {
          wx.showToast({
            title: "转发失败",
            icon: "none",
            duration: 1000,
            mask: true
          });
        }
      };
    }
  },
  onPullDownRefresh() {
    this.onShows();
  }
};
</script>

<style scoped>
.InviteFriends_die > div:nth-child(1) {
  width: 100%;
  height: 10rpx;
  background: #dddddd;
}
.InviteFriends_die > div:nth-child(2) {
  width: 100%;
  padding-top: 20rpx;
  text-align: center;
}
.InviteFriends_die > div:nth-child(2) > div:nth-child(1) {
  position: relative;
}
.InviteFriends_die > div:nth-child(2) > div:nth-child(1) > img {
  width: 136rpx;
  height: 136rpx;
  border-radius: 50%;
  position: absolute;
  left: 305rpx;
  bottom: -150rpx;
}
.InviteFriends_die > div:nth-child(2) > div:nth-child(2) {
  width: 471rpx;
  padding-top: 57rpx;
  padding-left: 44rpx;
  padding-right: 44rpx;
  margin: 0 auto;
  border: 1px solid rgba(229, 229, 229, 1);
  box-sizing: border-box;
  margin-top: 80rpx;
}
.InviteFriends_die > div:nth-child(2) > div:nth-child(2) > img {
  width: 368rpx;
  height: 368rpx;
}
.InviteFriends_die > div:nth-child(2) > div:nth-child(2) > div {
  font-size: 28rpx;
  font-weight: 500;
  color: rgba(1, 105, 234, 1);
  height: 80rpx;
  line-height: 80rpx;
}
.InviteFriends_die > div:nth-child(3) {
  padding: 0 30rpx;
  box-sizing: border-box;
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(1) {
  background: rgba(255, 255, 255, 1);
  box-shadow: 0px 0px 8px 0px rgba(102, 102, 102, 0.35);
  border-radius: 10rpx;
  padding: 0 136rpx 30rpx 136rpx;
  box-sizing: border-box;
  margin-top: 20rpx;
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(1) > div:nth-child(1) {
  font-size: 24rpx;
  font-weight: 500;
  color: rgba(51, 51, 51, 1);
  line-height: 36px;
  text-align: center;
  height: 100rpx;
  line-height: 100rpx;
}
.InviteFriends_die
  > div:nth-child(3)
  > div:nth-child(1)
  > div:nth-child(2)
  > img {
  width: 96rpx;
  height: 96rpx;
  border-radius: 50%;
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(1) > div:nth-child(2) {
  display: flex;
  justify-content: space-around;
}
.InviteFriends_die
  > div:nth-child(3)
  > div:nth-child(1)
  > div:nth-child(2)
  button {
  background: #fff;
  border: none;
}
.InviteFriends_die
  > div:nth-child(3)
  > div:nth-child(1)
  > div:nth-child(2)
  button:after {
  border: none;
}
.InviteFriends_die
  > div:nth-child(3)
  > div:nth-child(1)
  > div:nth-child(2)
  button
  img {
  width: 96rpx;
  height: 96rpx;
  border-radius: 50%;
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(2) {
  width: 100%;
  height: 259rpx;
  background: url("http://www.zhaoshengku.net/wx-yuanjiaojvxing.png") center
    center no-repeat;
  background-size: 100% 100%;
  margin-top: 20rpx;
  padding: 45rpx 0;
  box-sizing: border-box;
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(2) > div {
  margin-bottom: 20rpx;
  width: 200rpx;
  text-align: center;
  margin: 0 auto;
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) {
  font-size: 50rpx;
  font-weight: bold;
  color: rgba(1, 105, 234, 1);
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(2) > div:nth-child(2) {
  font-size: 26rpx;
  font-weight: bold;
  color: rgba(153, 153, 153, 1);
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(2) > div:nth-child(3) {
  font-size: 26rpx;
  font-weight: bold;
  color: rgba(1, 105, 234, 1);
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(3) {
  margin-top: 20rpx;
  position: relative;
}
.InviteFriends_die
  > div:nth-child(3)
  > div:nth-child(3)
  > div:nth-child(1)
  > img {
  width: 100%;
  height: 19rpx;
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(3) > div:nth-child(1) {
  width: 100%;
}
.InviteFriends_die > div:nth-child(3) > div:nth-child(3) > div:nth-child(2) {
  width: 100%;
  height: 620rpx;
  background: url("http://www.zhaoshengku.net/wx-yuanjiaojvxingstr.png") center
    center no-repeat;
  background-size: 100% 100%;
  position: absolute;
  left: 0rpx;
  top: 26rpx;
  box-sizing: border-box;
  padding: 30rpx 10rpx;
}
.InviteFriends_die
  > div:nth-child(3)
  > div:nth-child(3)
  > div:nth-child(2)
  > div:nth-child(1) {
  display: flex;
  justify-content: space-between;
}
.InviteFriends_die
  > div:nth-child(3)
  > div:nth-child(3)
  > div:nth-child(2)
  > div:nth-child(1)
  > div {
  width: 220rpx;
  height: 60rpx;
  line-height: 60rpx;
  font-size: 26rpx;
  font-weight: bold;
  color: rgba(236, 244, 255, 1);
  text-align: center;
  background: #0169ea;
}
.InviteFriends_die
  > div:nth-child(3)
  > div:nth-child(3)
  > div:nth-child(2)
  > .scroll-view {
  height: 510rpx;
  width: 100%;
}
.scroll_view_div {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.scroll_view_div > div {
  font-size: 26rpx;
  font-weight: 400;
  color: rgba(51, 51, 51, 1);
  width: 220rpx;
  height: 50rpx;
  background: #fff;
  line-height: 50rpx;
  text-align: center;
  border-bottom: 1rpx solid #ecf4ff;
}
.scroll_view_div > div:nth-child(3) {
  font-size: 26rpx;
  font-weight: 400;
  color: rgba(1, 105, 234, 1);
}
.none_p {
  color: #666;
  height: 100rpx;
  line-height: 100rpx;
  font-size: 26rpx;
  text-align: center;
  width: 100%;
}
</style>
